import React, { Component } from 'react';
import { connect } from 'dva';
import { Modal, Icon, Toast } from 'antd-mobile';
import router from 'umi/router';
import MyNavBar from 'components/navbar/index';
import { remoteLinkAddress, returnUrl as url } from 'utils/ip';
import PDFViewers from 'components/pdf-viewer/pdf-viewers';
import PDFListDrawer from 'components/PDFListDrawer/index';
import TabbarList from 'components/tabbar/index';
import { showDingTalkHead, getSession, getIsDingTalk, isDingTalk, backToOut } from 'utils/utils';
import commonStyles from 'utils/common.less';
import { SignaturePad } from "components/signature-pad"
import SelectMethod from '../../components/selectMethod/index'
import {
	CSS_UNITS,
	FormsFactory,
	FORMS_CONFIG_MAP,
	FORM_TYPES,
	translateFormsToFront,
	translateFormsToEnd,
} from '../../components/envelope/form/form';
import { Form } from '../../components/envelope/form';
import style from './index.less';
import {
	E_TABBAR_DATA,
	AUTHENTICATION_FAIL_CODE,
	AUTHENTICATION_TYPE_CODE,
	CERTIFICATION_STATUS,
	ENTERPRISE_ACCOUNTAUTHENTICATION,
	ALIPAY_MODE,
	PERSONAL_TYPE,
	ENTER_TYPE,
	PROCESS_STATUS,
	USER_PERMISS_USESEAL,
	USER_PERMISS_ADDSEAL,
  	verificationMode
} from '../../utils/Enum';
import { recordEnterHistoryNum } from '../../utils/utils';

const DEFAULT_MAX_SCALE = 1.3;
const DEFAULT_MIN_SCALE = 0.3;
const DEFAULT_ROOM_IN_SCALE = 1.05;
const DEFAULT_ROOM_OUT_SCALE = 0.95;

const { alert } = Modal;

function computeFormsMap(forms) {
	let formsMap = {};
	forms.forEach(form => {
		if (!formsMap[form.docId]) formsMap[form.docId] = {};
		if (!formsMap[form.docId][form.page]) formsMap[form.docId][form.page] = [];
		formsMap[form.docId][form.page].push(form);
	});
	return formsMap;
}


function computePageSealMap(forms) {
	let formsMap = {};
	forms.forEach(form => {
		if (!formsMap[form.docId]) formsMap[form.docId] = [];
		formsMap[form.docId].push(form);
	});
	return formsMap;
}

const ULR_NO_LAYOUT = '/Signature';

@connect(({ signatureModel, pdfModel, basicLayoutModel }) => ({ signatureModel, pdfModel, basicLayoutModel }))
class signature extends Component {
	constructor(props) {
		super(props);
		this.state = {
			editing: false,//用于判定页面是否已经添加了签名
			openTab: '',//当从其他页面跳转回来时，判定哪个tabBar应该被打开的变量
			visibleType: false,
			isEditSeal: false, // 判断页面上是否存在章
			isEditPagingSeal: false, // 是否处于编辑骑缝章状态
			PagingSeal: [], // 选择 点击章得到的信息
			PagingSealMap: {},
			// scale: (document.documentElement.clientWidth - 80) / 794,
			scale: (document.documentElement.clientWidth) / 795,
			// scale:1,
			forms: [],
			saveSuccess: 0,//表单是否保存成功,0是初始状态，1是成功，2是失败
			openDrawer: false,
			leftIcon: 'flex',
			formsMap: {},
			modal: true,
			pdfDetail: {},
			certificationStatus: false,//存验证状态
			flag: true,
			signaturePadIsOpen: false
		};
		this.viewerRef = '';
		this.tabbarView = '';
		// FIXME: 先禁用扩放
		this.maxScale = DEFAULT_MAX_SCALE;
		// this.maxScale = (document.documentElement.clientWidth) / 795;
		// 不用缩放
		// this.minScale = DEFAULT_MIN_SCALE;
		this.minScale = (document.documentElement.clientWidth) / 795;
		this.roomInScale = DEFAULT_ROOM_IN_SCALE;
		this.roomOutScale = DEFAULT_ROOM_OUT_SCALE;

		this.closeDrawer = this.closeDrawer.bind(this);
	}

	// componentWillMount() {
	//   localStorage.setItem("enterType",ENTER_TYPE.INTERIOR)
	// }

	//获取跳转页面的参数
	componentDidMount() {
		const isDingTalk = getIsDingTalk()
		this.changLoadingAlipayPage(false)

		this.getUrlParams().then((res) => {
			this.saveReturnUrl()
			if (res === PROCESS_STATUS.UNKOWN_INITIAL_SUCCESS) {
				this.checkOperate();
				// this.getSessionWsid();
				// this.getForms('loadSavedForms');
			}

		})
		const isEnterPage = localStorage.getItem('isEnterPage') || 'yes';
		if (isEnterPage === 'yes') {
			recordEnterHistoryNum();
		}

	}



	isSuccessChange = () => {
		let isSuccess = localStorage.getItem('isSuccess') || '';
		const nextUrl = localStorage.getItem('nextUrl') || '';
		const isDingTalk = getIsDingTalk();
		if (isSuccess !== '') {
			window.removeEventListener('storage', this.isSuccessChange)
			router.push(nextUrl)
			localStorage.setItem('bizNo', '');
			localStorage.setItem('Certification', '');
			localStorage.setItem('status', '');
			localStorage.setItem('isSuccess', '')
			localStorage.setItem('Contact', '');
			localStorage.setItem('Captcha', '');
			localStorage.setItem('nextUrl', '');
			if (isDingTalk === 'true') {
				localStorage.setItem('haveToAlipay', '')
			}
		}
	}
	//跳入支付宝之前，设置监听器监听storage变化（用于解决钉钉容器内支付宝回跳新打开的窗口需要关闭的问题）
	startListen = async () => {
		Toast.loading('跳转中', 1)
		window.addEventListener("storage", this.isSuccessChange)
	}

	changLoadingAlipayPage = (status) => {
		const { dispatch } = this.props;
		dispatch({
			type: 'pdfModel/save',
			payload: {
				loadingAlipayPage: status,
			},
		});
	}

	saveReturnUrl = () => {
		const { dispatch } = this.props
		dispatch({
			type: 'basicLayoutModel/save',
			payload: { returnUrl: localStorage.getItem('returnUrl') }
		})
	}

	getUrlParams = async () => {
		const { dispatch } = this.props
		if (this.props.location) {
			let { signatureModel: { query } } = this.props
			if (Object.keys(query).length === 3) {
				let { Session = '', envelopeWsid = '', participantWsid = '' } = query
				const lastSession = localStorage.getItem('Session');
				if (lastSession && lastSession !== Session) {
					// localStorage.clear();
					localStorage.setItem('enterHistoryNum', '');
					localStorage.setItem('isEnterPage', '');
				}
				localStorage.setItem("enterType", ENTER_TYPE.INTERIOR)
				if (Session !== '' && envelopeWsid !== '' && participantWsid !== '' && localStorage.getItem('returnUrl')) {
					localStorage.setItem('Session', Session);
					localStorage.setItem('envelopeWsid', envelopeWsid);
					localStorage.setItem('participantWsid', participantWsid);
					// localStorage.setItem('returnUrl', unescape(url))
					dispatch({
						type: 'pdfModel/save',
						payload: { processStatus: PROCESS_STATUS.UNKOWN_INITIAL_SUCCESS }
					})
					return PROCESS_STATUS.UNKOWN_INITIAL_SUCCESS
				}

			}
			//以下这个else if是为了方便测试加入的
			else if (Object.keys(query).length === 4) {
				let { Session = '', envelopeWsid = '', participantWsid = '', returnUrl } = query
				const lastSession = localStorage.getItem('Session');
				if (lastSession && lastSession !== Session) {
					// localStorage.clear();
					localStorage.setItem('enterHistoryNum', '');
					localStorage.setItem('isEnterPage', '');
				}
				localStorage.setItem("enterType", ENTER_TYPE.INTERIOR)
				localStorage.setItem("returnUrl", unescape(returnUrl))
				if (Session !== '' && envelopeWsid !== '' && participantWsid !== '') {
					localStorage.setItem('Session', Session);
					localStorage.setItem('envelopeWsid', envelopeWsid);
					localStorage.setItem('participantWsid', participantWsid);
					// localStorage.setItem('returnUrl', unescape(url))
					dispatch({
						type: 'pdfModel/save',
						payload: { processStatus: PROCESS_STATUS.UNKOWN_INITIAL_SUCCESS }
					})
					return PROCESS_STATUS.UNKOWN_INITIAL_SUCCESS
				}

			}

			else if (localStorage.getItem('Session') && localStorage.getItem('envelopeWsid') && localStorage.getItem('participantWsid') && localStorage.getItem('returnUrl')) {
				dispatch({
					type: 'pdfModel/save',
					payload: { processStatus: PROCESS_STATUS.UNKOWN_INITIAL_SUCCESS }
				})
				return PROCESS_STATUS.UNKOWN_INITIAL_SUCCESS
			}
			else {

				dispatch({
					type: 'pdfModel/save',
					payload: { processStatus: PROCESS_STATUS.UNKOWN_INITIAL_ERROR }
				})
				alert('警告', '无法操作！', [
					{ text: '返回', onPress: () => backToOut() },
				])
				return PROCESS_STATUS.UNKOWN_INITIAL_ERROR
			}
		}
		dispatch({
			type: 'pdfModel/save',
			payload: { processStatus: PROCESS_STATUS.UNKOWN_INITIAL_ERROR }
		})
		alert('警告', '无法操作！', [
			{ text: '返回', onPress: () => backToOut() },
		])
		return PROCESS_STATUS.UNKOWN_INITIAL_ERROR
	}
	getIdentityInfo = () => {
		const { dispatch, pdfModel: { userType } } = this.props;
		if (userType === AUTHENTICATION_FAIL_CODE.PUSR) {
			const { pdfModel: { personalObj: { userData: { idttvWsid } } } } = this.props;
			dispatch({
				type: 'pdfModel/getPersonData',
				payload: { id: idttvWsid, type: PERSONAL_TYPE.SUBMIT },
			})
		}
	}


	getForms = (oper) => {
		const { dispatch } = this.props;
		const envelopeWsid = localStorage.getItem('envelopeWsid');
		let participantWsid = localStorage.getItem('participantWsid');//参与签署方分配的ID
		dispatch({
			type: 'signatureModel/getFormsSearch',
			payload: {
				envelopeWsid: envelopeWsid,
				participantWsid: participantWsid,
				query: {
					fields: null,
					filters: null,
					sorts: null,
					offset: 0,
					limit: 1000,
				},
			},
			callback: (res) => {
				if (oper === 'submit') {
					const { saveSuccess } = this.state;
					if (saveSuccess === 1) {
						this.submitConfirm(res);
					}
					else if (saveSuccess === 2) {
						alert('提示', '上传表单数据失败！请重试', [
							{
								text: '确定', onPress: () => {
								},
								style: 'default'
							},
						]);
					}
				}
				else if (oper === 'loadSavedForms') {
					this.showSavedForms(res);

				}

			}
		});
	}

	//将获取下来的已经保存但未确认签署的后端表单数据处理为前端可显示数据
	showSavedForms = (savesForms) => {
		let pagingSeal = savesForms.filter(form => {
			if (form.formType === "MULTI_CHECK_MARK" && form.confirmStatus === "UN_CONFIRMED") return true
			return false
		})
		let normalSeal = savesForms.filter(form => {
			if (form.formType !== "MULTI_CHECK_MARK" && form.confirmStatus === "UN_CONFIRMED") return true
			return false
		})
		const _data = translateFormsToFront(normalSeal)
		const _pagingSeal = translateFormsToFront(pagingSeal)
		this.setState({
			forms: _data,
			formsMap: computeFormsMap(_data),//pageRender渲染签字签章时会取这里面的数据
			PagingSeal: _pagingSeal,
			PagingSealMap: computePageSealMap(_pagingSeal),//pageRender渲染骑缝章时会取这里面的数据
		})
	}
	getSessionWsid = async () => {
		Toast.loading('加载中', 0);
		const { dispatch } = this.props;
		await this.getPDFList()
		await dispatch({
			type: 'pdfModel/getUserSessions',
			payload: {
				Session: localStorage.getItem('Session'),
			},
			callback: async (userWsid, type) => {
				switch (type) {
					case AUTHENTICATION_FAIL_CODE.EUSR:
						await dispatch({
							type: 'pdfModel/getEnterpriseUsers',
							payload: { userWsid },
							callback: async () => {
								this.getUserData();
								await this.getUserPermiss()
								Toast.hide()
							}
						})
						break;
					case AUTHENTICATION_FAIL_CODE.PUSR:
						await dispatch({
							type: 'pdfModel/getPersonalUsers',
							payload: { userWsid },
							callback: () => {
								this.getIdentityInfo();
								this.getUserData();
								Toast.hide();
							}
						})
						break;
					default:
						break;
				}
			},
		})
	};
	getUserPermiss = async () => {
		const { dispatch } = this.props;
		dispatch({
			type: 'pdfModel/getUserPermiss',
			payload: {
				privilegeWsid: USER_PERMISS_USESEAL
			},
			typeSeal: USER_PERMISS_USESEAL
		})
		await dispatch({
			type: 'pdfModel/getUserPermiss',
			payload: {
				privilegeWsid: USER_PERMISS_ADDSEAL
			},
			typeSeal: USER_PERMISS_ADDSEAL
		})
	}

	getUserData = () => {
		const { location: { params }, dispatch } = this.props;
		if (params) {
			const { type } = params;
			this.setState({
				openTab: type || '',
			});
		}

		this.changePdfTop()
		const { pdfModel: { processStatus } } = this.props;
		switch (processStatus) {
			case PROCESS_STATUS.EUSR_AUTHORIZED_ERROR:
				this.showModal();
				break;
			case PROCESS_STATUS.EUSR_AUTHORIZING_ERROR:
				this.showModal();
				break;
			default:
				const enterpriseWsid = localStorage.getItem('enterpriseWsid')
				dispatch({
					type: 'pdfModel/getEnterpriseData',
					payload: enterpriseWsid
				})
				break;

		}

		// if(result){
		//   switch (result) {
		//     case CERTIFICATION_STATUS.ERROR:
		//       this.showModal();
		//       break;
		//     case CERTIFICATION_STATUS.SUCCESS:
		//       this.state.certificationStatus = true;
		//       break;
		//     default:
		//       this.showModal();
		//       break;
		//   }
		// }else {
		//   this.showModal();
		// }

		//   }else {
		//     // this.showModal();
		//   }
		// } else {
		//   // this.showModal();
		// }
	};

	//权限不允许操作时，展示的弹框
	showOperateModal = (message) => {
		alert('提示', message, [
			{
				text: '退出', onPress: () => {
					backToOut();
					//退出签署页面
				},
				style: 'default'
			},
		]);
	}
	//进入页面首先检查操作权限
	checkOperate = () => {
		const { dispatch } = this.props;
		let envelopeWsid = localStorage.getItem('envelopeWsid');
		let participantWsid = localStorage.getItem('participantWsid');//参与签署方分配的ID
		dispatch({
			type: 'signatureModel/getOperateInfo',
			payload: {
				envelopeWsid: envelopeWsid,
				participantWsid: participantWsid,
			},
			callback: (res) => {
				if (res) {
					const code = res.code.substring(res.code.length - 4);
					const { userMessage } = res;
					if (code !== '0000') {
						dispatch({
							type: 'pdfModel/save',
							payload: { processStatus: PROCESS_STATUS.UNKOWN_INITIAL_SUCCESS },
						});
						this.showOperateModal(userMessage)

						// switch (code) {
						//   case '1100':
						//     this.showOperateModal('缺少登录用户信息，需要先登录');
						//     break;
						//   case '1025':
						//     this.showOperateModal('信封状态错误，已不是待处理状态');
						//     break;
						//   case '1026':
						//     this.showOperateModal('接收方状态错误，不是待处理状态');
						//     break;
						//   case '1060':
						//     this.showOperateModal('还没有轮到参与方处理信封');
						//     break;
						//   case '1061':
						//     this.showOperateModal('该参与方已经处理过了信封，不能重复处理');
						//     break;
						//   case '1062':
						//     this.showOperateModal('该参与方不是系统用户');
						//     break;
						//   case '1091':
						//     this.showOperateModal('信封接收方逾期未处理');
						//     break;
						//   case '1101':
						//     this.showOperateModal('当前参与方未加入企业');
						//     break;
						//   case '1102':
						//     this.showOperateModal('当前参与方未在信封流程中');
						//     break;
						//   default:
						//     this.showOperateModal('当前不可操作！');
						//
						// }
					} else {
						dispatch({
							type: 'pdfModel/save',
							payload: { processStatus: PROCESS_STATUS.UNKOWN_INITIAL_SUCCESS },
						});
						this.getSessionWsid();
						this.getForms('loadSavedForms');
					}

				}

			},
		});
	};

	//点击提交时，先保存，然后确认签署
	onSubmitAndConfirm = () => {
		this.onSave('submitConfirm');
	}

	//确认签署
	// submitConfirm=(forms)=>{
	//   const { dispatch } = this.props;
	//   const envelopeWsid=localStorage.getItem('envelopeWsid');
	//   let participantWsid = localStorage.getItem('participantWsid');//参与签署方分配的ID
	//   let signFormsWsid=[];
	//   forms.forEach((item)=>{
	//     signFormsWsid.push({
	//       formWsid:item.formWsid,
	//     });
	//   });
	//   dispatch({
	//     type: 'signatureModel/submitConfirm',
	//     payload: {
	//       envelopeWsid: envelopeWsid,
	//       participantWsid:participantWsid,
	//       formsWsidData:{
	//         signForms:[...signFormsWsid]
	//       }
	//     },
	//     callback:(res)=>{
	//       if(res===1){
	//         router.push('/SignTheSuccess');
	//       }
	//     }
	//   })
	// }


	/*
	函数作用：保存当前表单信息，根据oper来决定保存之后的操作
	参数解释：oper为用于判断callback中应执行操作的变量，不传则为默认只保存，
			  backUrl和isExternal是oper为‘save’时，callback函数中所需的参数，
			  url是oper为‘saveAndLeave’时，save后要跳转的页面的url
	*/
	onSave = async (oper = '', backUrl = '', isExternal = '', url = '') => {
		const { saveSuccess } = this.state;
		let formSaveType = '';
		if (saveSuccess !== 1) {
			const { dispatch, signatureModel: { formsList } } = this.props;
			let forms = [...this.state.forms, ...this.state.PagingSeal];
			let envelopeWsid = localStorage.getItem('envelopeWsid');
			let participantWsid = localStorage.getItem('participantWsid');//参与签署方分配的ID
			let finalForms = translateFormsToEnd(forms);//将前端的数据格式转为后端能接受的格式
			if (finalForms.length > 0 || oper !== '') {
				//对操作后的表单数组和操作前的数据进行对比,得出进行了相应变化的表单数据，news保存新增的表单，updates表示更新了的表单，deletes表示删除了的表单
				let newForms = forms;
				let oldForms = translateFormsToFront(formsList);
				let news = newForms.filter(form => form.id === '');

				let exists = newForms.filter(oldform => {
					return oldForms.find(form => form.id === oldform.id);
				});
				let deletesItem = oldForms.filter(oldform => {
					return !newForms.find(form => form.id === oldform.id);
				});
				let deletes = [];
				deletesItem.forEach((item) => {
					deletes.push({
						formWsid: item.id,
					});
				});

				let updates = exists.filter(form => {
					let oldForm = oldForms.find(old => old.id === form.id);
					if (form.sameAs(oldForm)) {
						return false;
					}
					return true;
				});
				dispatch({
					type: 'signatureModel/editFormsData',
					payload: {
						news: translateFormsToEnd(news),
						updates: translateFormsToEnd(updates),
						deletes: {
							forms: [...deletes],
						},
						envelopeWsid: envelopeWsid,
						participantWsid: participantWsid,
					},
					callback: (res) => {

						this.setState({
							saveSuccess: res,
						});


						// if(res===1&&oper==='submitConfirm'){
						//   this.getForms('submit');
						// }


						//oper为‘save'，表示跳出签署页面之前的保存表单数据操作，（在components/navbar里，传递过此参数）
						if (oper === 'save') {
							this.getForms('justGetForms');
							this.onSaveBack();
						}
						//oper为‘saveAndLeave’表示跳入某页面的保存表单数据操作，（在tabbar/index中的gonext函数中传递过此参数）
						if (res === 1 && oper === 'saveAndLeave') {
							router.push(url);
						}
					},
				});
				formSaveType = PROCESS_STATUS.UNKOWN_FORMS_SUCCESS;
			} else {

				if (oper === '') {
					alert('提示', '请至少添加一个签名或印章！', [
						{
							text: '确定', onPress: () => {
							},
							style: 'default',
						},
					]);
					formSaveType = PROCESS_STATUS.UNKOWN_FORMS_ERROR;
				}
				// }
			}
			;
		}
		return formSaveType;
	};

	countDown() {
		let count = 5;
		const { flag } = this.state;
		if (flag) {
			const timer = setInterval(() => {
				count--;
				if (count === 0) {
					clearInterval(timer);
					this.setState({ flag: false });
				}
			}, 1000);
		}
	}

	getPDFList = async () => {
		const { dispatch } = this.props;
		await dispatch({
			type: 'pdfModel/getPDFList',
			payload: {
				fields: null,
				filters: null,
				sorts: null,
				offset: 0,
				limit: 1000,
			},
		});
	};

	getViewRectPositionInfo(viewRect) {
		return this.viewerRef.getViewRectPositionInfo(viewRect);
	}

	//设置文档缩放比例
	setScale(scale, center = {
		top: document.documentElement.clientHeight / 2,
		left: document.documentElement.clientWidth / 2,
	}) {
		if (scale === this.state.scale) return;
		if (scale > this.maxScale) scale = this.maxScale;
		if (scale < this.minScale) scale = this.minScale;
		this.viewerRef.setScale(scale, center);
		this.setState({
			scale: scale,
		});
	}

	onZoomIn = (center) => {
		this.setScale(this.state.scale * this.roomInScale, center);
	};

	//缩小事件
	onZoomOut = (center) => {
		this.setScale(this.state.scale * this.roomOutScale, center);
	};
	//设置缩放比例事件
	onScaleChange = (scale, center) => {
		this.setScale(scale, center);
	};

	//表单项请求更新(更新表单在页面的位置信息)
	onUpdateFormPostion = (from, viewRect, docId, offset) => {
		// debugger
		let seals = this.state.forms;
		let info = this.getViewRectPositionInfo(viewRect);
		if (!info) return;
		// debugger
		let scale = this.state.scale;
		if (from.type === FORM_TYPES.PAGING_SEAL) {
			from.docId = docId;
			from.page = info.page;
			from.position.top = info.rectInPage.top / scale;
			from.position.left = info.rectInPage.left / scale;
			from.position.width = info.rectInPage.width / scale;
			from.position.height = info.rectInPage.height / scale;
			from.position.ulx = info.rectInPage.left / scale;
			from.position.uly = info.rectInPage.top / scale;
			from.position.lrx = (info.rectInPage.left + info.rectInPage.width) / scale;
			from.position.lry = (info.rectInPage.top + info.rectInPage.height) / scale;
			from.offset = offset / scale;
			// from.docId = docId || info.docId;
			// from.page = info.page;
			// from.position.top = info.rectInPage.top / scale;
			// from.position.left = info.rectInPage.left / scale;
			// from.position.width = info.rectInPage.width / scale;
			// from.position.height = info.rectInPage.height / scale;
			// from.position.ulx = info.rectInPage.left / scale;
			// from.position.uly = info.rectInPage.top / scale;
			// from.position.lrx = (info.rectInPage.left + info.rectInPage.width) / scale;
			// from.position.lry = (info.rectInPage.top + info.rectInPage.height) / scale;
			// from.offset = offset / scale;
		} else {
			// console.log(seals)
			seals = seals.map((item) => {
				// debugger
				if (from.random === item.random) {
					item.docId = docId || info.docId;
					item.page = info.page;
					item.position.top = info.rectInPage.top / scale;
					item.position.left = info.rectInPage.left / scale;
					item.position.width = info.rectInPage.width / scale;
					item.position.height = info.rectInPage.height / scale;
					item.position.ulx = info.rectInPage.left / scale;
					item.position.uly = info.rectInPage.top / scale;
					item.position.lrx = (info.rectInPage.left + info.rectInPage.width) / scale;
					item.position.lry = (info.rectInPage.top + info.rectInPage.height) / scale;
					item.offset = offset / scale;
				}
				return item
			})
			// let item=seals.findIndex((currentValue, index)=>{
			//   if(currentValue.random===from.random)
			//     return index;
			// })
			// seals.splice(item,1,from);
			// console.log('form->',from)
			// console.log(seals, computeFormsMap(seals))
			// debugger
			console.log('触发更新')
			this.setState({
				forms: seals,
				formsMap: computeFormsMap(seals)
			})
		}


	};

	onActiveForm = form => {
		if (form.type === FORM_TYPES.PAGING_SEAL) {
			this.setState({
				activedSeal: form,
			});
		} else {
			this.setState({
				activedForm: form,
			});
		}
	};

	openDrawer = () => {
		const { openDrawer } = this.state;
		if (openDrawer) {
			this.setState({
				openDrawer: false,
				leftIcon: 'flex',
			});
		} else {
			this.setState({
				openDrawer: true,
				leftIcon: 'none',
			});
		}
	};

	onSignForm = form => {
		//点击表单的事件
	};
	onDeleteForm = form => {
		let forms = this.state.forms.filter(_ => _ !== form);

		let PagingSeal = this.state.PagingSeal.filter(_ => _ !== form);
		let map = computeFormsMap(forms);
		let PagingSealMap = computePageSealMap(PagingSeal);
		this.setState({
			forms,
			formsMap: map,
			PagingSeal,
			PagingSealMap,
			editing: false,
			// isEditSeal: false,
			// isEditPagingSeal: false,
			activedForm: '',
			activedSeal: '',
		});
	};


	pageRender = ({ docId, page, docHeight, editSeal }) => {
		// console.log(this.state.forms, this.state.formsMap)
		let { scale, formsMap, activedForm, isEditSeal, PagingSealMap, isEditPagingSeal, activedSeal } = this.state;
		let cutPagingSealMsg = {};
		const _page = page;
		const pageSize = this.viewerRef.documentRenders.filter(item => item.docId === docId)[0].pageRenders.length;
		if (pageSize > 10) {
			cutPagingSealMsg.cutNums = 10;
			cutPagingSealMsg.currentCut = Math.ceil(_page / (pageSize / 10));
		} else {
			cutPagingSealMsg.cutNums = pageSize;
			cutPagingSealMsg.currentCut = _page;
		}
		let sealRenders = [];
		const pageSealInForm = PagingSealMap[docId];
		if (pageSealInForm && pageSealInForm.length > 0) {
			const _pagingSealDOM = pageSealInForm.map((form, index) => {
				form.docHeight = docHeight;
				return (
					<Form key={`${form.docId}_${index}`} formData={form} scale={scale} onUpdateFormPostion={this.onUpdateFormPostion}
						isActive={activedSeal === form}
						onActive={() => this.onActiveForm(form)} onSign={() => this.onSignForm(form)}
						onDelete={() => this.onDeleteForm(form)}
						editPagingSeal={!isEditPagingSeal}
						cutPagingSealMsg={cutPagingSealMsg}
						onEditPagingSeal={this.onEditPagingSeal}
						changeEditSeal={this.changeEditSeal} />
				);
			});
			sealRenders = _pagingSealDOM;
		}

		if (editSeal) return sealRenders

		if (!formsMap[docId]) return sealRenders;
		if (!formsMap[docId][page]) return sealRenders;
		// console.log(formsMap[docId][page])
		const _seal = formsMap[docId][page].map((form, index) => {
			form.docHeight = docHeight;
			return (
				<Form key={String(index)} formData={form} scale={scale} onUpdateFormPostion={this.onUpdateFormPostion}
					isActive={activedForm === form}
					onActive={() => this.onActiveForm(form)} onSign={() => this.onSignForm(form)}
					onDelete={() => this.onDeleteForm(form)}
					PagingSeal={!isEditPagingSeal}
					cutPagingSealMsg={cutPagingSealMsg} />
			);
		});


		return [...sealRenders, ..._seal];
	};
	changeEditSeal = () => {
		this.setState({
			isEditSeal: true,
		});

	};

	clearOpenTab = () => {
		this.setState({
			openTab: '',
		});
	};

	onChangeEditSealStatus = (signInfo, type, fileWsid) => {
		this.setState({
			editing: true,
		});
		if (type === FORM_TYPES.PAGING_SEAL) {
			this.changeEditSeal();
			this.viewerRef.firstPagesRender();
		}
		this.onClickOfAppendForm(signInfo, type, fileWsid);
		this.viewerRef.updateShowPages();
		this.viewerRef.setEditingDocId(fileWsid)
	};

	onBindPDFRef = (ref) => {
		this.viewerRef = ref;
	};


	onSaveBack = () => {
		backToOut();
	}

	//监听添加签名事件,构造和初始化相应类型签名数据
	// fileWsid 盖骑缝章时选文件得到的文件id，不用则不传入
	onClickOfAppendForm = (signInfo, type, fileWsid) => {
		console.log('type->', type)
		console.log('signInfo->', signInfo)
		const { pdfModel: { userType } } = this.props;
		let participantWsid = localStorage.getItem('participantWsid');//参与签署方分配的ID
		const { link: { href }, } = signInfo;
		const baseURL = remoteLinkAddress() + 'file';
		const sessionWsid = getSession();
		const src = baseURL + href + '?X-Requested-Session=' + sessionWsid;
		let newForm = FormsFactory.createForm(type);
		let scale = this.state.scale;
		let formConfig
		let formHeight
		let formWidth
		if (FORM_TYPES.SEAL === type || FORM_TYPES.PAGING_SEAL === type) {
			const { dimension: { width = 42, height = 42 } } = signInfo
			console.log(scale)
			formHeight = height / 25.4 * 72.0 * scale * CSS_UNITS
			formWidth = width / 25.4 * 72.0 * scale * CSS_UNITS
		} else {
			formConfig = FORMS_CONFIG_MAP.get(type);
			formHeight = formConfig.defaultSize.height * scale;
			formWidth = formConfig.defaultSize.width * scale;
		}


		//初始化表单在屏幕当中的位置
		let viewHeight = document.documentElement.clientHeight;
		let viewWidth = document.documentElement.clientWidth;
		let formRectInView = {
			top: viewHeight / 2 - formHeight / 2,
			left: viewWidth / 2 - formWidth / 2,
			height: formHeight,
			width: formWidth,
			bottom: viewHeight / 2 + formHeight / 2,
			right: viewWidth / 2 + formWidth / 2,
		};
		let info = this.getViewRectPositionInfo(formRectInView);
		console.log('info->', info)
		if (!info) return;
		if (type === FORM_TYPES.SEAL) {
			const { officeSealWsid } = signInfo;
			newForm.data = {
				id: officeSealWsid,
				imageData: src,
				certType: 'DISPOSABLE_CERT',
				renderingMode: 'GRAPHIC',
			};
			newForm.page = info.page;
		} else if (type === FORM_TYPES.PAGING_SEAL) {
			const { officeSealWsid } = signInfo;
			newForm.data = {
				sealWsid: officeSealWsid,
				sealData: src,
				certType: 'DISPOSABLE_CERT',
				renderingMode: 'GRAPHIC',
			};
			newForm.page = 1;
		} else {
			const { personSealWsid } = signInfo;
			newForm.data = {
				id: personSealWsid,
				imageData: src,
				certType: 'DISPOSABLE_CERT',
				renderingMode: 'GRAPHIC',
			};
			newForm.page = info.page;
		}
		if (userType === AUTHENTICATION_FAIL_CODE.PUSR) {
			const { pdfModel: { personalIdentity: { name, idCardType, idCardNo, phone } } } = this.props;
			newForm.certificate = {
				type: "PFX_ON_TIME",
				onTimeRequestCertificateInfo: {
					selectedAuthTypes: [
						"LIVING_AUTH"
					],
					identity: {
						name: name || '',
						identityType: idCardType || '',
						identityNo: idCardNo || '',
						phone: phone || '',
					},
					enterprise: {
						name: null,
						unifiedSocialCreditCode: null
					}
				}
			};
		}

		else if (userType === AUTHENTICATION_FAIL_CODE.EUSR) {
			const { pdfModel: { enterpriseObj: { userData: { person: { idCardType, idCardNo, name, phone } }, enterpriseAccountAuthentication: { enterprise } } } } = this.props;
			//企业信息
			newForm.certificate = {
				type: "PFX_ON_TIME",
				onTimeRequestCertificateInfo: {
					selectedAuthTypes: [
						"LIVING_AUTH"
					],
					identity: {
						name: name || null,
						identityType: idCardType || null,
						identityNo: idCardNo || null,
						phone: phone || null,
					},
					enterprise: {
						name: enterprise.name || null,
						unifiedSocialCreditCode: enterprise.unifiedSocialCreditCode || null,
					}
				}
			};
		}
		newForm.participantWsid = participantWsid;
		newForm.docId = fileWsid ? fileWsid : info.docId;
		newForm.type = type;
		newForm.scale = this.state.scale;
		if (type !== FORM_TYPES.PAGING_SEAL) {
			newForm.position.top = info.rectInPage.top / scale;
			newForm.position.left = info.rectInPage.left / scale;
			newForm.position.width = info.rectInPage.width / scale;
			newForm.position.height = info.rectInPage.height / scale;
		}
		newForm.pageSize = this.viewerRef.firstPageRenders.length;
		newForm.docHeight = info.pageRect.height;

		this.setState(state => {
			let PagingSealMap = state.PagingSealMap;
			let map = state.formsMap;
			if (type === FORM_TYPES.PAGING_SEAL) {
				newForm.position.top = 0;
				state.PagingSeal.push(newForm);
				PagingSealMap = computePageSealMap(state.PagingSeal);
				this.viewerRef.getSealInfo(PagingSealMap);
				return {
					activedSeal: newForm,
					forms: state.forms,
					formsMap: map,
					PagingSeal: state.PagingSeal,
					PagingSealMap,
					docId: fileWsid ? fileWsid : info.docId,
				};
			} else {
				state.forms.push(newForm);
				map = computeFormsMap(state.forms);
				return {
					activedForm: newForm,
					forms: state.forms,
					formsMap: map,
					PagingSeal: state.PagingSeal,
					PagingSealMap,
					docId: fileWsid ? fileWsid : info.docId,
				};
			}
			return {
				forms: state.forms,
				formsMap: map,
				PagingSeal: state.PagingSeal,
				PagingSealMap,
				docId: fileWsid ? fileWsid : info.docId,
			};
		});
	};

	savePagingSeal = () => {
		const { docId, isEditPagingSeal } = this.state;
		this.setState({
			isEditSeal: false,
			isEditPagingSeal: false,
		}, () => {
			docId && this.viewerRef.scrollToFormPage(docId, isEditPagingSeal);
		});
	};

	onEditPagingSeal = (status, docId) => {
		docId && this.viewerRef.setEditingDocId(docId);
		this.viewerRef.firstPagesRender()
		this.setState({
			isEditPagingSeal: status,
			docId,
		});
	};
	getIntendCertification = () => {
		const { dispatch, pdfModel: { userType } } = this.props;
		const session = localStorage.getItem('Session');
		const userWsid = localStorage.getItem('userWsid')
		const returnUrl = localStorage.getItem('returnUrl')
		const envelopeWsid = localStorage.getItem('envelopeWsid')
		const participantWsid = localStorage.getItem('participantWsid')
		const enterType = localStorage.getItem('enterType')
		const haveToAlipay = 'yes';
		Toast.loading('加载中', 0);
		this.changLoadingAlipayPage(true)
		switch (userType) {
			case AUTHENTICATION_FAIL_CODE.EUSR:
				const { pdfModel: { enterpriseObj: { userData: { person: { idCardNo, name } } } } } = this.props;
				let alipayReturnUrl = `${url()}/SignCertificationResults?envelopeWsid=${envelopeWsid}&participantWsid=${participantWsid}&type=${userType}&userWsid=${userWsid}&session=${session}&Certification=${PROCESS_STATUS.UNKOWN_WISH_APPLY}&returnUrl=${escape(returnUrl)}&enterType=${enterType}&haveToAlipay=${haveToAlipay}`
				if (isDingTalk()) {
					alipayReturnUrl = `dingtalk://dingtalkclient/page/link?url=${escape(alipayReturnUrl)}`;
				}
				dispatch({
					type: 'pdfModel/getIntendCertification',
					payload: {
						certName: name,
						certNo: idCardNo,
						faceType: ALIPAY_MODE.MULTIPLE_FACTOR,
						userPersonWsid: userWsid,
						returnUrl: alipayReturnUrl
					}
				});
				break;
			case AUTHENTICATION_FAIL_CODE.PUSR:
				const { pdfModel: { personalObj: { userData: { idttvWsid } } } } = this.props;
				dispatch({
					type: 'pdfModel/getIntendPersonData',
					payload: { id: idttvWsid, userType, type: PERSONAL_TYPE.CERTIFICATION },
				});
				break;
			default:
				break;
		}

	};

	showPersonal = () => {

		const { pdfModel: { personalObj: { idttvStatus } } } = this.props;
		let type = -1
		switch (idttvStatus) {
			case AUTHENTICATION_TYPE_CODE.EXPIRED:

				break;
			case AUTHENTICATION_TYPE_CODE.INCOMPLETE:
				alert('您未实名认证', '根据相关政策，您需要完成实名认证才可进行', [
					{
						text: '取消', onPress: () => {
							this.setState({
								saveSuccess: 0,
							})
						}, style: 'default'
					},
					{
						text: '前往认证', onPress: () => {
							router.push(`/PersonalCertification?url=/Signature&type=${AUTHENTICATION_FAIL_CODE.PUSR}`);
						},
					},
				]);
				break;
			case AUTHENTICATION_TYPE_CODE.PASSED:
				// alert('身份验证', '您已查阅并愿意签署本文件 人脸识别完成签署', [
				//   { text: '取消', onPress: () => {}, style: 'default' },
				//   {
				//     text: '继续', onPress: () => {
				//       this.getIntendCertification();
				//     },
				//   },
				// ]);
				type = 1
				break;
			default:
				this.changeModal();
				alert('您未实名认证', '根据相关政策，您需要完成实名认证才可进行', [
					{ text: '取消', onPress: () => { }, style: 'default' },
					{
						text: '前往认证', onPress: () => {
							router.push(`/PersonalCertification?url=/Signature&type=${AUTHENTICATION_FAIL_CODE.PUSR}`);
						},
					},
				]);
				break;
		}
		return type
	};
	showEnterprise = () => {
		const { pdfModel: { enterpriseObj: { identityStatus, enterpriseStatus } } } = this.props;
		let type = -1
		if (enterpriseStatus !== ENTERPRISE_ACCOUNTAUTHENTICATION.PRIMARY_PASSED || identityStatus !== AUTHENTICATION_TYPE_CODE.PASSED) {
			alert(`您${identityStatus === AUTHENTICATION_TYPE_CODE.PASSED ? '的企业' : ''}未实名认证`, `根据相关政策，${identityStatus === AUTHENTICATION_TYPE_CODE.PASSED ? '您的企业' : '您'}需完成实名认证才可进行电子签署`, [
				{ text: '取消', onPress: () => { }, style: 'default' },
				{
					text: '前往认证', onPress: () => {
						router.push(`/EnterpriseCertificationList`);
					},
				},
			]);
		} else {
			switch (enterpriseStatus) {
				case ENTERPRISE_ACCOUNTAUTHENTICATION.PRIMARY_DENY:
					alert('您的企业未实名认证', '根据相关政策，您需要完成实名认证才可进行', [
						{ text: '取消', onPress: () => { }, style: 'default' },
						{
							text: '前往认证', onPress: () => {
								router.push(`/EnterpriseCertificationList`);
							},
						},
					]);
					break;
				case ENTERPRISE_ACCOUNTAUTHENTICATION.PRIMARY_PASSED:
					// alert('身份验证', '您已查阅并愿意签署本文件 人脸识别完成签署', [
					//   { text: '取消', onPress: () => {}, style: 'default' },
					//   {
					//     text: '继续', onPress: () => {
					//       this.getIntendCertification();
					//     },
					//   },
					// ]);
					type = 1
					break;
				default:
					break;
			}
		}
		return type
	};
	changeModal = () => {
		this.setState({
			modal: false,
		});
	};
	showModal = () => {
		alert('您的企业未认证', '根据相关政策，您的企业需完成认证才可进行签署', [
			{
				text: '返回', onPress: () => {
					const returnUrl = localStorage.getItem('returnUrl');
					backToOut();
				}, style: 'default'
			},
			{
				text: '前往认证', onPress: () => {
					router.push(`/EnterpriseCertificationList`);
				},
			},
		]);
		// let type=-1
		// switch (userType) {
		//   case AUTHENTICATION_FAIL_CODE.EUSR:
		//     type=this.showEnterprise();
		//     break;
		//   case AUTHENTICATION_FAIL_CODE.PUSR:
		//     type=this.showPersonal();
		//     break;
		//   default:
		//     break;
		// }
		// return type
	};

	showCertification = () => {
		this.onSave().then((res) => {
			if (res !== PROCESS_STATUS.UNKOWN_FORMS_ERROR) {
				const { pdfModel: { processStatus } } = this.props;
				switch (processStatus) {
					case PROCESS_STATUS.EPUSR_AUTHORIZING_ERROR:
					case PROCESS_STATUS.EPUSR_AUTHORIZED_ERROR:
					case PROCESS_STATUS.PUSR_AUTHORIZING_ERROR:
					case PROCESS_STATUS.PUSR_AUTHORIZED_ERROR:
						alert('您未实名认证', '根据相关政策，您需要完成实名认证才可进行签署', [//
							{
								text: '取消', onPress: () => {
									this.setState({
										saveSuccess: 0,
									})

									this.getForms('loadSavedForms');
								}, style: 'default'
							},
							{
								text: '继续', onPress: () => {
									router.push(`/PersonalCertification?url=/Signature&type=${AUTHENTICATION_FAIL_CODE.EPUSR}&Certification=${PROCESS_STATUS.UNKOWN_PAUTHORIZING_APPLY}`);
								},
							},
						]);
						break;
					case PROCESS_STATUS.PUSR_AUTHORIZED_SUCCESS:
					case PROCESS_STATUS.EPUSR_AUTHORIZED_SUCCESS:
					case PROCESS_STATUS.UNKOWN_WISH_ERROR:
						// alert('身份验证',
						//   <div>
						//     <div>您已查阅并愿意签署本文件</div>
						//     <div>人脸识别完成签署</div>
						//   </div>
						//   , [
						//     {
						//       text: '取消', onPress: () => {
						//         this.changLoadingAlipayPage(false)
						//         this.setState({
						//           saveSuccess: 0,
						//         });

						//         this.getForms('loadSavedForms');
						//       }, style: 'default',
						//     },
						//     {
						//       text: '继续', onPress: () => {
						//         if (isDingTalk()) {
						//           this.startListen();
						//         }
						//         this.getIntendCertification();
						//       },
						//     },
						//   ]);
						const { dispatch } = this.props
						dispatch({
							type: 'signatureModel/setMask',
							payload: {
								isShowSelect: true,
								verificationMode: this.userPhone ? verificationMode.SMSVERIFICATION : verificationMode.ALIPAYVERIFICATION
							}
						})
						break;
				}
			}

			//   const { pdfModel: { userType } } = this.props;
			//   switch (userType) {
			//     case AUTHENTICATION_FAIL_CODE.EUSR:
			//       const { pdfModel: { enterpriseObj: {enterpriseStatus } } } = this.props;
			//       if(enterpriseStatus===ENTERPRISE_ACCOUNTAUTHENTICATION.PRIMARY_PASSED){
			//         alert('身份验证', '您已查阅并愿意签署本文件 人脸识别完成签署', [
			//           { text: '取消', onPress: () => {}, style: 'default' },
			//           {
			//             text: '继续', onPress: () => {
			//               this.getIntendCertification();
			//             },
			//           },
			//         ]);
			//       }
			//       break;
			//     case AUTHENTICATION_FAIL_CODE.PUSR:
			//       const { pdfModel: { personalObj: { idttvStatus } } } = this.props;
			//       if(idttvStatus===AUTHENTICATION_TYPE_CODE.PASSED){
			//         alert('身份验证', '您已查阅并愿意签署本文件 人脸识别完成签署', [
			//           { text: '取消', onPress: () => {}, style: 'default' },
			//           {
			//             text: '继续', onPress: () => {
			//               this.getIntendCertification();
			//             },
			//           },
			//         ]);
			//       }
			//       break;
			//     default:
			//       break;
			//   }
		})

	}

	getPdfDetail = () => {
		const { pdfModel: { pdfList } } = this.props;
		let data = [];
		const url = remoteLinkAddress();
		pdfList.forEach((item) => {
			const { fileName, fileHref: { href }, fileWsid } = item;
			let pdfObj = {
				name: fileName,
				id: fileWsid,
				pdfSrc: url + 'file' + href + '?X-Requested-Session=' + getSession(),
			};
			data.push(pdfObj);
		});
		return data;
	};

	getPdfId = (data) => {
		const { pdfDetail } = this.viewerRef;
		pdfDetail(data);
	};

	getPdfScroll = (top) => {
		const { dispatch } = this.props
		dispatch({
			type: 'pdfModel/save',
			payload: { scrollTop: top }
		})
	}

	changePdfTop = () => {
		const { pdfModel: { scrollTop = 0 } } = this.props
		const { changePdfTop } = this.viewerRef
		if (changePdfTop) {
			changePdfTop(scrollTop)
		}

	}

	//确认签名
	/**
	 * 上传图片
	 * 关闭签名板
	 */
	onSignaturePadConfirm = async data => {
		const { dispatch, } = this.props;
		const usid = localStorage.getItem('userWsid');
		Toast.loading('生成图片中', 0)
		await dispatch({
			type: 'sealAndSignatureModel/postSignatureAdd',
			payload: {
				name: '手写签名',
				from: 'TEXT_INPUT',
				authorWsid: usid,
				base64: data.imageData.replace(/data:image\/.*;base64,/, '')
			},
			callback: res => {
				Toast.hide()
				//关闭签名板
				this.closeSignaturePad()
				//将签名放在pdf上
				this.onChangeEditSealStatus(res.personSeal, E_TABBAR_DATA[0].type)
			}
		})
		// this.setState({
		//   openTab: 'WRITE_SIGN',
		// })
		// this.tabbarView.setstate({
		//   popType: 'WRITE_SIGN',
		// })
	}

	closeSignaturePad() {
		this.setState({
			signaturePadIsOpen: false,
		})
	}

	openSignaturePad = (e) => {
		const { signaturePadIsOpen } = e
		this.setState({
			signaturePadIsOpen,
		});
	}
	openSignaturePop = (params) => {
		const { openTab } = params
		const { dispatch } = this.props;
		dispatch({
			type: 'pdfModel/save',
			payload: { openTab }
		})
		// this.changePdfTop()
	}

	bindSignatureView = (tabbarView) => {
		this.tabbarView = tabbarView
	}

	closeDrawer(e) {
		const { openDrawer, leftIcon } = e;
		this.setState({
			openDrawer,
			leftIcon,
		});
	}

	get userPhone() {
		var { personalObj: { userData: { phone = '' } } } = this.props.pdfModel
		if (!phone) {
			const { enterpriseObj: { userData } } = this.props.pdfModel
			//如果用户数据不存在返回上一页
			if (Object.keys(userData).length !== 0) {
				var { person: { phone = '' } } = userData
			}
		}

		return phone
	}

	render() {
		const isDingTalk = getIsDingTalk()
		const url = localStorage.getItem('returnUrl');
		const { scale, openDrawer, leftIcon, isEditSeal, isEditPagingSeal, certificationStatus, signaturePadIsOpen, openTab } = this.state;
		const pdfList = this.getPdfDetail();
		const { signatureModel: { formsList, isShowSelect, selectSMS }, pdfModel: { loadingAlipayPage } } = this.props;
		// console.log(this.state.forms)
		// this.changePdfTop()
		// const contentContainer=style.contentContainer+' '+commonStyles.headerTop
		const contentContainer = isDingTalk === 'true' ? style.contentContainer : style.contentContainer + ' ' + commonStyles.headerTop
		return (
			<div className={style.pageContainer} onTouchStart={this.onTopTouchStart}>
				<div className={style.pageContainer} style={{ display: !signaturePadIsOpen ? 'block' : 'none' }}>
					<MyNavBar onSave={this.onSave} title={'签署文件'} isExternal={true} backUrl={url} />
					<div className={contentContainer} style={{ height: isDingTalk === 'true' ? '92vh' : '86vh' }}>
						<PDFViewers onBindPDFRef={this.onBindPDFRef} scale={scale} docs={pdfList}
							onZoomIn={this.onZoomIn} onZoomOut={this.onZoomOut} onScaleChange={this.onScaleChange}
							pageRender={this.pageRender} editSeal={isEditSeal} getPdfScroll={this.getPdfScroll} />
						{
							isEditPagingSeal ? '' : <div className={style.DrawerIcon} style={{ display: leftIcon }}>
								<div className={style.Drawer} onClick={this.openDrawer}>
									<Icon type='right' color="white" />
								</div>
							</div>
						}
						{
							openDrawer ? <PDFListDrawer sidebar={pdfList}
								scale={scale} closeDrawer={this.closeDrawer} getPdfId={this.getPdfId} /> : ''
						}
					</div>
					<TabbarList clearOpenTab={this.clearOpenTab} isEditPagingSeal={this.state.isEditPagingSeal}
						onSave={this.onSave}
						editing={this.state.editing} openTab={openTab}
						onClickOfAppendForm={this.onClickOfAppendForm}
						onChangeEditSealStatus={this.onChangeEditSealStatus}
						savePagingSeal={this.savePagingSeal}
						onClickSubmit={this.onSubmitAndConfirm}
						onEditPagingSeal={this.onEditPagingSeal}
						closeDrawer={this.closeDrawer}
						showModal={this.showModal}
						getUserData={this.getUserData}
						certificationStatus={certificationStatus}
						showCertification={this.showCertification} loadingAlipayPage={loadingAlipayPage}
						openSignaturePad={this.openSignaturePad}
						bindSignatureView={this.bindSignatureView}
					/>
				</div>
				<div style={{ display: !signaturePadIsOpen ? 'none' : 'block' }}>
					<SignaturePad isOpen={this.state.signaturePadIsOpen} openSignaturePop={this.openSignaturePop} onConfirm={this.onSignaturePadConfirm} onCancel={() => this.closeSignaturePad()} />
				</div>
				<SelectMethod
					onClose={this.onClose}
					isShow={isShowSelect}
					onAlipay={this.onAlipay}
					onSMS={this.onSMS}
				/>
			</div>
		);
	}

	//下方弹框点击关闭
	onClose = e => {
		const { dispatch } = this.props
		this.changLoadingAlipayPage(false)
		this.setState({
			saveSuccess: 0
		});
		dispatch({
			type: 'signatureModel/setMask',
			payload: {
				isShowSelect: false
			}
		})
		this.getForms('loadSavedForms');
	}

	//下方弹框支付宝认证函数
	onAlipay = e => {
		alert('身份验证',
			<div>
				<div>您已查阅并愿意签署本文件</div>
				<div>人脸识别完成签署</div>
			</div>,
			[{
				text: '取消',
				onPress: () => {
					this.changLoadingAlipayPage(false)
					this.setState({
						saveSuccess: 0,
					});
					this.getForms('loadSavedForms');
				},
				style: 'default'
			}, {
				text: '继续',
				onPress: () => {
					if (isDingTalk()) {
						this.startListen();
					}
					this.getIntendCertification();
				}
			}]
		);
	}

	//短信认证函数
	onSMS = e => {
		router.push({
			pathname: '/EnterVerificationCode'
		})
	}
}


export default signature;
